<template>
    <Modal title="自定义打印内容" v-model="show" :closable="false" :mask-closable="false" @on-visible-change="showModal" :width="500">
        <el-form ref="formInfo" label-position="right" label-width="80px" :model="formInfo">
            <el-form-item label="打印模板" prop="templateUrl">
                <el-select v-model="formInfo.templateUrl" style="width: 320px">
                    <el-option v-for="(vl,ky) in paperSizes" :key="ky" :label="ky" :value="vl">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="数量" prop="count">
                <el-input v-model="formInfo.count" style="width: 320px" type="number" />
            </el-form-item>
            <el-form-item label="内容" prop="content" >
                <el-input type="textarea" style="width: 320px" v-model="formInfo.content" :row="10" />
            </el-form-item>
        </el-form>
        <div slot="footer">
            <el-button size="small" @click="cancel">取消</el-button>
            <el-button size="small" type="primary" :loading="modalLoading" @click="ok">确定打印</el-button>
        </div>
    </Modal>
</template>
<script>
import api from "@/api/api"
import { getRand } from "@/utils/random"
export default {
    name: 'StorageProduct',
    data() {
        return {

            show: false,
            paperSizes: {
                "100mm*100mm": api.otherTemplateUrl_100_100,
                "70mm*50mm": api.otherTemplateUrl_70_50
              
            },
            formInfo: {
                count: 1,
                templateUrl: api.otherTemplateUrl_100_100,
                content: "",
            },
            modalLoading: false

        };
    },
    mounted: function() {



    },
    props: [
        'product'
    ],
    methods: {
        hideDialog() {
            this.modalLoading = false;
            this.show = false;
        },
        showDialog() {
            this.show = true;
        },
        showModal: function(value) {
            if (value) {

            } else {

            }
        },

        ok: function() {
            if (!this.formInfo.content) {
                this.errorMessage("请输入要打印的内容");
                return;
            }
            let orderData = [];
            let dt = getRand();
            for (var i = 0; i < this.formInfo.count; i++) {
                orderData.push({
                    "documentID": dt + "-" + i,
                    "contents": [{
                        data: {
                            content: this.formInfo.content,
                        },
                        templateURL: this.formInfo.templateUrl
                    }]
                });
            }
             this.$emit("boxCallBack", orderData);
            // this.hideDialog();
        },
        cancel: function() {
            this.hideDialog();
            this.$emit("cancel");
        }
    }
}
</script>
<style scoped>
</style>